// pages/goods_detail/goods_detail.js

/**
 * 购物车逻辑
 * 1，先绑定点击事件
 * 2，获取缓存中的购物车数据 数组格式
 * 3，先判断 当前的商品是否已近存在于购物车
 * 4，已经存在 修改商品数据 执行购物车数量++ 重新把购物车数组 填充会缓存中
 * 5，不存在于购物车的数组中 直接给购物车数组添加一个新元素 新元素带上购买数量属性
 * 6，弹出提示
 */

import {
    request
} from '../../request/index.js'

Page({

    /**
     * 页面的初始数据
     */
    data: {
        goodsObj: {},
        isCollected: false
    },

    /**
     * 商品收藏按钮
     * 1 页面onshow的时候 加载缓存中的商品收藏的数据
     * 2 判断当前商品是不是被收藏
     *  1 是，改变乸的图标
     *  2 不是，，，
     * 3 点击商品收藏按钮
     *  1 判断改商品是否存在于汉朝数组中
     *  2 已经存在 把该商品删除
     *  3 没有存在 把商品添加到收藏数组中，存入到缓存中即可 
     */
    handleCollect() {

        let isCollected = false

        const collect = wx.getStorageSync('collect') || [];

        const index = collect.findIndex(v => v.goods_id === this.data.goodsObj.goods_id)

        // !== -1 说明收藏数组有这个，那么删除
        if (index !== -1) {
            collect.splice(index, 1)
            isCollected = false
            wx.showToast({
                title: '取消收藏',
                icon: 'success',
                mask: true
            });
        } else {
            collect.push(this.data.goodsObj)
            isCollected = true
            wx.showToast({
                title: '收藏成功',
                icon: 'success',
                mask: true
            });
        }

        wx.setStorageSync('collect', collect);
        this.setData({
            isCollected
        })
    },


    async getGoodsDetail(goods_id) {

        const { data } = await request({
            url: '/goods/detail',
            data: {
                goods_id
            }
        });
        // this.setData({
        //     goodsObj: data.message
        // })
        // 优化获得的数据接口，去掉接口返回的本页不需要的数据项

        // 缓存中拿收藏数组
        const collect = wx.getStorageSync('collect') || [];

        const isCollected = collect.some(v => {
            // 传递的goods_id 是string 需要给 v.goods_id 转换处理下进行比较
            return v.goods_id + '' === goods_id
        })

        this.setData({
            goodsObj: {
                goods_id: data.message.goods_id,
                goods_name: data.message.goods_name,
                goods_price: data.message.goods_price,
                goods_introduce: data.message.goods_introduce,
                pics: data.message.pics
            },
            isCollected
        })
    },

    // 点击预览大图
    handlePreviewImage(e) {

        const { pics_mid } = e.currentTarget.dataset

        const urls = this.data.goodsObj.pics.map(v => {
            return v.pics_mid
        })

        wx.previewImage({
            current: pics_mid,
            urls
        });
    },

    // 购物车添加
    handleCartAdd() {
        /**
         * 购物车逻辑
         * 1，先绑定点击事件
         * 2，获取缓存中的购物车数据 数组格式
         * 3，先判断 当前的商品是否已近存在于购物车
         * 4，已经存在 修改商品数据 执行购物车数量++ 重新把购物车数组 填充会缓存中
         * 5，不存在于购物车的数组中 直接给购物车数组添加一个新元素 新元素带上购买数量属性
         * 6，弹出提示
         */

        const cart = wx.getStorageSync('cart') || [];

        const index = cart.findIndex(v => (v.goods_id === this.data.goodsObj.goods_id))

        // -1 表示购物车没这一项
        if (index === -1) {
            this.data.goodsObj.num = 1
            this.data.goodsObj.checked = true
            cart.push(this.data.goodsObj)
        } else {
            cart[index].num += 1
        }

        // 购物车数据添加入缓存
        wx.setStorageSync('cart', cart);

        wx.showToast({
            title: '添加成功',
            mask: true
        });
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function(options) {
        // const { goods_id } = options
        // this.getGoodsDetail(goods_id)

    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function() {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function() {

        // 通过页面栈来获取url参数的方法，用来在show里获取options
        const pages = getCurrentPages();
        const curPage = pages[pages.length - 1]
        const { goods_id } = curPage.options

        this.getGoodsDetail(goods_id)

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function() {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function() {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function() {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function() {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function() {

    },


})